<template>
		
    <div>
        Count: {{ count }}
        <button @click="increment">点击 count + 1 </button>
    
    </div>
    
    <div>
        <button @click="awesome = !awesome">切换显示内容 Toggle</button>
        <p v-if="awesome">Vue is awesome!</p>
        <p v-else>Oh no 😢</p>
    </div>

</template>

<script>
export default {
    name: "fnTemplate",
    data(){
        // 定义参数
        return { 
            count: 0,
            awesome: true
        }
    },
    methods: {
        increment() {
            this.count++
        }
    },
    mounted() {
        console.log("组件完成渲染, 并创建dom")
        this.increment()
    }
}
</script>